<!DOCTYPE >
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8" />
    <title>用户管理</title>
    <link rel="icon" type="image/x-icon" href="/static/images/logoIcon.icon">
    <link rel="stylesheet" href="/static/css/user.css">
</head>

<body>
<!-- 头部导航条 -->
<div id="nav">
    <div class="heard">
        <div class="logo">
            <p>ITArmy后台管理</p>
        </div>
        <a href="/user/sign" class="signout">退出</a>
        <a href="/user/index" class="signout">主页</a>
    </div>

</div>
<!-- 侧边栏 -->
<div id="aside">
    <div class="menu">
        <ul>
            <li>
                <a href="/admin/Blog/list">博客管理&nbsp;<img src="/static/images/blog.svg" /></a>
            </li>
            <li>
                <a href="/admin/Type/list">博客类型&nbsp;<img src="/static/images/kind.svg"/></a>
            </li>
            <li>
                <a href="/admin/Serialize/list">连载管理&nbsp;<img src="/static/images/stroy.svg" /></a>
            </li>
            <li>
                <a href="/admin/Order/list">订单管理&nbsp;<img src="/static/images/order.svg" /></a>
            </li>
            <li class="active">
                <a href="/admin/User/list">用户管理&nbsp;<img src="/static/images/user.svg" alt="" /></a>
            </li>
            <li>
                <a href="/admin/Question/list">问题管理&nbsp;<img src="/static/images/question.svg" /></a>
            </li>
            <li>
                <a href="/admin/Exchange/list">汇率管理&nbsp;<img src="/static/images/rate.svg" alt="" /></a>
            </li>
            <li >
                <a href="/admin/ContributeAudit/list">投稿审核&nbsp;<img src="/static/images/word.svg"></a>
            </li>
        </ul>
    </div>
</div>
<div class="fill">
    <table class="table table-bordered">
        <thead class="heard">
        <tr>
            <th>用户信息</th>
        </tr>
        </thead>
        <tbody>
        <tr>
            <td class="we">
                <div id="remove" style="margin:12px 10px;">
                    <a class="delatemore" href="javascript:;">
                        <img src="/static/images/rubsh.svg">
                        <span>批量删除</span>
                    </a>
                    <a class="addbtn" href="javascript:;">
                        <img src="/static/images/add.svg">
                        <span>增加用户</span>
                    </a>
                </div>
                <form class="navbar-form navbar-left" role="search">
                    <input type="text" id="search" placeholder="根据用户id搜索">
                    <input type="button" id="find" value="查询">
                    <input type="button" id="back" value="返回">
                </form>
            </td>
        </tr>
        </tbody>
    </table>

    <div class="through">
        <table id="employeeTable">
            <thead>
                <tr>
                    <th class="switch"><input type="checkbox" id="check"></th>
                    <th>ID</th>
                    <th>用户昵称</th>
                    <th>用户密码</th>
                    <th class="do">邮箱</th>
                    <th>性别</th>
                    <th>电话</th>
                    <th>vip</th>
                    <th>余额</th>
                    <th>等级</th>
                    <th>身份</th>
                    <th class="do">注册时间</th>
                    <th class="do">到期时间</th>
                    <th class="do">操作</th>
                </tr>
            </thead>
            <tbody>
                <tr th:each="User:${userList.list}">
                    <td class="switch"><input type="checkbox" name="user"></td>
                    <td th:text="${User.uId}"></td>
                    <td th:text="${User.uName}"></td>
                    <td th:text="${User.uPwd}"></td>
                    <td th:text="${User.uEmail}"></td>
                    <td th:text="${User.uSex}"></td>
                    <td th:text="${User.uTel}"></td>
                    <td th:text="${User.uVip}"></td>
                    <td th:text="${User.uBalance}"></td>
                    <td th:text="${User.uGrade}"></td>
                    <td th:text="${User.uManage}"></td>
                    <td th:text="${#dates.format(User.uTime,'yyyy-MM-dd HH:mm:ss')}"></td>
                    <td th:text="${#dates.format(User.uExpire,'yyyy-MM-dd HH:mm:ss')}"></td>
                    <td class="itemDelete">
                        <button class="delate">删除</button>
                        <button class="compiler">编辑</button>
                    </td>
                </tr>
            </tbody>
        </table>
        <div class="page" th:if="${userList.pages>0}"><!--分页-->
            <ul class="pageUl">
                <li class="pageLi"><a th:href="@{'/admin/User/list?page=1'}">首页</a></li>
                <li class="pageLi" th:if="${userList.pageNum-3 >=1}"><a th:href="@{'/admin/User/list?page=' + ${userList.pageNum-3}}" th:text="${userList.pageNum -3}" >1</a></li>
                <li class="pageLi" th:if="${userList.pageNum-2 >=1}"><a th:href="@{'/admin/User/list?page=' + ${userList.pageNum-2}}" th:text="${userList.pageNum -2}" >1</a></li>
                <li class="pageLi" th:if="${userList.pageNum-1 >=1}"><a th:href="@{'/admin/User/list?page=' + ${userList.pageNum-1}}" th:text="${userList.pageNum -1}" >1</a></li>
                <li class="pageLi active1"><a th:href="@{'/admin/User/list?page=' + ${userList.pageNum}}" th:text="${userList.pageNum}" ></a></li>
                <li th:if="${userList.pageNum+1} <= ${userList.pages}" ><a th:href="@{'/admin/User/list?page=' + ${userList.pageNum+1}}" th:text="${userList.pageNum +1}" >1</a></li>
                <li th:if="${userList.pageNum+2} <= ${userList.pages}" ><a th:href="@{'/admin/User/list?page=' + ${userList.pageNum+2}}" th:text="${userList.pageNum +2}" >1</a></li>
                <li th:if="${userList.pageNum+3} <= ${userList.pages}" ><a th:href="@{'/admin/User/list?page=' + ${userList.pageNum+3}}" th:text="${userList.pageNum +3}" >1</a></li>
                <li th:class="${userList.pageNum == userList.pages}?'disabled' : ''" ><a th:href="@{'/admin/User/list?page=' + ${userList.pageNum+1}}">下一页</a></li>
            </ul>
        </div>
        <!--修改的模态框-->
        <div class="modal movefade movemodal" id="movemodal">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header">
                        <i>X</i>
                        <h4>用户管理</h4>
                    </div>
                    <div class="modal-body">
                        <div class="modal-content">
                            <div class="word">
                                <span>I&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;D</span>
                            </div>
                            <div class="textera">
                                <input type="text" id="id" title="不能修改" readonly>
                            </div>
                        </div>
                        <div class="modal-content">
                            <div class="word">
                                <span>用户昵称:</span>
                            </div>
                            <div class="textera">
                                <input type="text" id="username">
                            </div>
                        </div>
                        <div class="modal-content">
                            <div class="word">
                                <span>用户密码:</span>
                            </div>
                            <div class="textera">
                                <input type="text" id="password">
                            </div>
                        </div>
                        <div class="modal-content">
                            <div class="word">
                                <span>邮&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;箱:</span>
                            </div>
                            <div class="textera">
                                <input type="text" id="age">
                            </div>
                        </div>
                        <div class="modal-content">
                            <div class="word">
                                <span>性&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;别:</span>
                            </div>
                            <div class="textera">
                                <input type="text" id="sex">
                            </div>
                        </div>
                        <div class="modal-content">
                            <div class="word">
                                <span>电&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;话:</span>
                            </div>
                            <div class="textera">
                                <input type="text" id="tel">
                            </div>
                        </div>
                        <div class="modal-content">
                            <div class="word">
                                <span>V&nbsp;&nbsp;&nbsp;I&nbsp;&nbsp;&nbsp;P:</span>
                            </div>
                            <div class="textera">
                                <input type="text" id="vip">
                            </div>
                        </div>
                        <div class="modal-content">
                            <div class="word">
                                <span>余&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;额:</span>
                            </div>
                            <div class="textera">
                                <input type="text" id="money">
                            </div>
                        </div>
                        <div class="modal-content">
                            <div class="word">
                                <span>等&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;级:</span>
                            </div>
                            <div class="textera">
                                <input type="text" id="low">
                            </div>
                        </div>
                        <div class="modal-content">
                            <div class="word">
                                <span>身&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;份:</span>
                            </div>
                            <div class="textera">
                                <input type="text" id="admin">
                            </div>
                        </div>
                        <span class="aword">输入1为管理员，0是用户</span>
                        <div class="modal-content">
                            <div class="word">
                                <span>注册时间:</span>
                            </div>
                            <div class="textera">
                                <input type="text" id="time" readonly title="不能修改">
                            </div>
                        </div>
                        <div class="modal-content">
                            <div class="word">
                                <span>到期时间:</span>
                            </div>
                            <div class="textera">
                                <input type="text" id="data" readonly title="不能修改">
                            </div>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button class="same addbtn_ok">确定</button>
                        <button class="same addbtn_no">取消</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!--增加用户-->
    <div class="modal addfade" id="addmodal">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <i>X</i>
                    <h4>用户管理</h4>
                </div>
                <div class="modal-body">
                    <div class="modal-content">
                        <div class="word">
                            <span>I&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;D:</span>
                        </div>
                        <div class="textera">
                            <input type="text" >
                        </div>
                    </div>
                    <div class="modal-content">
                        <div class="word">
                            <span>用户昵称:</span>
                        </div>
                        <div class="textera">
                            <input type="text">
                        </div>
                    </div>
                    <div class="modal-content">
                        <div class="word">
                            <span>用户密码:</span>
                        </div>
                        <div class="textera">
                            <input type="text">
                        </div>
                    </div>
                    <div class="modal-content">
                        <div class="word">
                            <span>邮&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;箱:</span>
                        </div>
                        <div class="textera">
                            <input type="text">
                        </div>
                    </div>
                    <div class="modal-content">
                        <div class="word">
                            <span>性&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;别:</span>
                        </div>
                        <div class="textera">
                            <input type="text">
                        </div>
                    </div>
                    <div class="modal-content">
                        <div class="word">
                            <span>电&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;话:</span>
                        </div>
                        <div class="textera">
                            <input type="text">
                        </div>
                    </div>
                    <div class="modal-content">
                        <div class="word">
                            <span>V&nbsp;&nbsp;&nbsp;I&nbsp;&nbsp;&nbsp;P:</span>
                        </div>
                        <div class="textera">
                            <input type="text">
                        </div>
                    </div>
                    <div class="modal-content">
                        <div class="word">
                            <span>余&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;额:</span>
                        </div>
                        <div class="textera">
                            <input type="text">
                        </div>
                    </div>
                    <div class="modal-content">
                        <div class="word">
                            <span>等&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;级:</span>
                        </div>
                        <div class="textera">
                            <input type="text">
                        </div>
                    </div>
                    <div class="modal-content">
                        <div class="word">
                            <span>身&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;份:</span>
                        </div>
                        <div class="textera">
                            <input type="text">
                        </div>
                    </div>
                    <span class="aword">输入1为管理员，0是用户</span>
                    <div class="modal-content">
                        <div class="word">
                            <span>注册时间:</span>
                        </div>
                        <div class="textera">
                            <input type="text">
                        </div>
                    </div>
                    <div class="modal-content">
                        <div class="word">
                            <span>到期时间:</span>
                        </div>
                        <div class="textera">
                            <input type="text">
                        </div>
                    </div>
                </div>
                    <div class="modal-footer">
                        <button class="same addbtnok">确定</button>
                        <button class="same addbtn_no">取消</button>
                    </div>
                </div>
            </div>
        </div>
    </div>

</div>
</body>
<script src="/static/js/jquery-3.3.1.min.js"></script>
<script src="/static/js/user.js"></script>

</html>